<!DOCTYPE html>
<html lang="zh-CN">

<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
	<title>screen</title>
  <!-- 引入swiper -->
  <link rel="stylesheet" type="text/css" href="js/font-awesome/css/font-awesome.css" />
	<link rel="stylesheet" href="js/swiper-2.7.6/swiper.min.css">
	<!-- Bootstrap -->
	<link href="js/bootstrap/bootstrap.min.css" rel="stylesheet">
  <link rel="stylesheet" href="lib/layui/css/layui.css">
	<!-- 引入全局配置 -->
	<link rel="stylesheet" type="text/css" href="css/start.css">
	<!--引入公共样式-->
  <link rel="stylesheet" type="text/css" href="css/common.css" />
</head>

<body class="screen">
	<!-- 头部开始 -->
<div id="header">
	<div class="top">
		<div class="top-left">
			<i class="fa fa-map-marker "></i>
			<a href="javascript:void(0)" class="one">广州</a>
			<a href="javascript:void(0)" class="two">切换城市</a>
		</div>
		<div class="top-right">
			<a class="one">
				<i class="fa fa-user"></i> 朱莉
			</a>
			<a href="javascript:void(0)">退出</a>
			<a href="javascript:void(0)">帮助中心</a>
			<a href="javascript:void(0)">网站导航</a>
			<a href="javascript:void(0)">手机APP</a>
		</div>

	</div>
	<div class="searchBox">
		<div class="search">
			<div class="search-left">
				<h3>互生 <small>商务服务</small></h3>
			</div>
			<div class="search-right">
				<div class="one">
					<input type="text" name="search" id="search" value="输入商家名称、分类或地区" placeholder="输入商家名称、分类或地区" />
					<a href="javascript:void(0)">
						<i class="fa fa-search"></i>
					</a>
				</div>

				<div class="two" id="top-nav">
          <script id="top-nav-script" type="text/html">
            {{each data val index}}
              <a href="#">{{val.cateName}}</a>
            {{/each}}
          </script>
        </div>
			</div>

		</div>

	</div>

</div>
<!-- 头部结束 -->
  <div >
    <div class="container">
      <div class="titleNav">
        首页/商务服务/IT网站
      </div>
      <!-- 筛选条件框 -->
      <div class="classify">
        <div class="titleAllBox">
          <div class="title">
            分类
          </div>
          <div class="titleAll">
            <ul class="titleAllUl" id="pid-box">
              <script id="pid-script" type="text/html">
                {{each data val index}}
                  <li class="{{index==0?'screenActive':''}}" data-pid="{{val.id}}">{{val.categoryName}}</li>
                {{/each}}
              </script>
              <!-- <li class="screenActive">全部</li>
              <li>网站建设/设计</li>
              <li>软件开发</li> -->
            </ul>
          </div>
        </div>
        <div class="originBox">
          <div class="title">
            区域
          </div>
          <div class="titleAll">
            <ul class="titleAllUl" id="county-box">
              <!-- <li class="screenActive">全部</li> -->
              <script id="county-script" type="text/html">
                {{each data val index}}
                  <li class="{{index==0?'screenActive':''}}" data-area-code="{{val.areaCode}}">{{val.areaName}}</li>
                {{/each}}
              </script>
            </ul>
            <ul class="titleAllUlDetail" id="buscircle-box">
              <!-- <li class="screenActive">全部</li> -->
              <script id="buscircle-script" type="text/html">
                {{each data val index}}
                  <li class="{{index==0?'screenActive':''}}" data-area-id="{{val.id}}">{{val.locationName}}</li>
                {{/each}}
              <!-- <li>网站建设/设计</li>
              <li>软件开发</li> -->
              </script>
            </ul>
          </div>
        </div>
      </div>
      <!--列表信息内容 -->
     <div class="screenList">
       <div class="title">
         <select class="" name="" id="sub-select">
           <script id="sub-select-script" type="text/html">
           {{each data val index}}
           <option value="{{val.id}}">{{val.categoryName}}</option>
              {{/each}}
            </script>
         </select>
         <span class="haoping">好评
           <span class="glyphicon glyphicon-triangle-bottom"></span>
         </span>
         <select class="" name="" id="inte-sort">
            <option value="0">智能排序</option>
            <option value="1">店铺开通时间</option>
            <option value="2">发布服务时间</option>
         </select>
         <!-- <div class="number">
           <span class="glyphicon glyphicon-triangle-left" aria-hidden="true"></span>
           1/10
           <span class="glyphicon glyphicon-triangle-right" aria-hidden="true"></span>
         </div> -->
       </div>
        <div id="content-box">
          <script id="content-script" type="text/html">
            {{each data value}}
              <div class="content">
                <div class="pic">
                  <img src="{{value.shopLogo}}" alt="">
                </div>
                <div class="infoDivC">

                <div class="infoDiv">
                  <div class="info">
                    <div class="nameDiv">
                      <div class="name">
                      {{value.shopName}}
                      </div>
                      <div class="phone">
                        ({{value.entResno}})
                      </div>
                    </div>
                    <div class="rate">
                      <% for(var i = 0; i < value.round; i++){ %>
                        <i class="fa fa-star"></i>
                      <% } %>
                      <% for(var i = 0; i < value.cha; i++){ %>
                        <i class="fa fa-star-o"></i>
                      <% } %>
                      <span style="	color: #b6b6b6;margin-left:8px;">{{value.shopEvaluateValue}}分</span>
                      <span style="	color: #b6b6b6;margin-left:20px;">{{value.areaName}}</span>
                    </div>
                    <div class="tag">
                        <% for(var j = 0; j < value.categoryNames.length; j++){ %>
                          <span class="label label-info">{{value.categoryNames[j]}}</span>
                        <% } %>
                    </div>
                    <div class="adress">
                      <span class="glyphicon glyphicon-map-marker" aria-hidden="true"></span>
                        {{value.shopAddress}}
                    </div>
                  </div>
                  <div class="infoRight">
                    <div class="login">
                      <span class=" glyphicon glyphicon-earphone" aria-hidden="true" style="margin-right:10px;"></span>
                      {{value.shopPhone == 0?'登录可看':value.shopPhone}}
                    </div>
                    <div class="comm">
                        <span class=" glyphicon glyphicon-envelope" aria-hidden="true"  style="margin-right:10px;"></span>
                      在线咨询
                    </div>
                  </div>
                </div>
                {{each value.goodsList value}}
                  <div class="infoBot">
                    <% if (value.goodsImg) { %> 
                      <img src="{{pirUrl+value.goodsImg}}" alt="">
                    <% } %>
                    {{value.goodsName}}
                  </div>
                {{/each}}
              </div>
              </div>
            {{/each}}
          </script>
        </div>
        <div id="Pagination"></div>
        <!-- <div class="fenye">
          <nav aria-label="Page navigation">
            <ul class="pagination">
              <li>
                <a href="#" aria-label="Previous">
                  <span aria-hidden="true">&laquo;</span>
                </a>
              </li>
              <li><a href="#">1</a></li>
              <li><a href="#">2</a></li>
              <li><a href="#">3</a></li>
              <li><a href="#">4</a></li>
              <li><a href="#">5</a></li>
              <li>
                <a href="#" aria-label="Next">
                  <span aria-hidden="true">&raquo;</span>
                </a>
              </li>
            </ul>
          </nav>
        </div> -->

     </div>
    </div>
  </div>
	<!--**********底部开始**********-->
<div class="foot" id="foot">
	<p>
		<strong>客服热线： </strong>
		<a href="javascript:void(0)">
			0755-83344111
		</a>
		<span class="foot-adition">2013-2018 </span>
		<span>
				深圳市互生电子商务有限公司
			</span>
		<span>
				粤ICP备案号14100052号
			</span>
	</p>
</div>
		<!--**********底部结束**********-->
</body>
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="js/common/baseUrl.js"></script>
<script src="js/common/jquery-1.12.2.js"></script>
<!-- 引入swiper插件 -->
<script type="text/javascript" src="js/swiper-2.7.6/swiper.min.js"></script>
<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
<script src="js/bootstrap/bootstrap.min.js"></script>
<!-- 让 IE8 支持 HTML5 元素和媒体查询（media queries）功能 -->
<script type="text/javascript" src="js/common/respond.min.js"></script>
<script type="text/javascript" src="js/common/html5.min.js"></script>
<script type="text/javascript" src="js/common/common.js"></script>
<script src="http://res.hsxt.cn/pub/data/js/city.js" type="text/javascript"></script>
<script src="http://res.hsxt.cn/pub/data/js/county.js" type="text/javascript"></script>
<script src="http://res.hsxt.cn/pub/data/js/businessCircle.js" type="text/javascript"></script>
<script src="lib/layui/layui.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.7/es5-shim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.7/es5-sham.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/json3/3.3.2/json3.min.js"></script>
<script src="lib/artTemplate.js"></script>
<script src="js/screen.js"></script>


</html>
